import 'package:flutter/gestures.dart';
import 'package:flutter_screenutil/screen_util.dart';
import 'package:flutter_staggered_grid_view/flutter_staggered_grid_view.dart';
import 'package:lishopflu/base/base_import.dart';
import 'package:lishopflu/base/controller_import.dart';
import 'package:lishopflu/bean/icon_text_bean.dart';
import 'package:lishopflu/router/app_navigator.dart';

import 'package:lishopflu/base/view_import.dart';
import 'package:lishopflu/utils/list_util.dart';

import 'my_ctl.dart';

class MyPage extends BasePage<MyCtl>{



  @override
  void onCreate(BuildContext mContext) {

  }

  @override
  Widget pageBody(BuildContext context) {
    return Flex(
      direction: Axis.vertical,
      crossAxisAlignment: CrossAxisAlignment.end,
      children: [

        Padding(padding: EdgeInsets.only(top: statusBarHeight)),

        GestureDetector(
          behavior: HitTestBehavior.opaque,
          onTap: (){
            controller.toSetting();
          },
          child: Container(
            padding: EdgeInsets.only(top: 10, bottom: 10, left: 15, right: 15),
            child: Text('设置'),
          ),
        ),

        Container(
          margin: EdgeInsets.only(left: 15, right: 15, bottom: 10),
          child: GestureDetector(
            behavior: HitTestBehavior.opaque,
            onTap: (){
              controller.toPerson();
            },
            child: Flex(
              direction: Axis.horizontal,
              mainAxisAlignment: MainAxisAlignment.center,
              children: [
                CircleAvatar(
                  backgroundImage: AssetImage('images/banner4.jpg',),
                  radius: 40,
                ),

                Expanded(
                  flex: 1,
                  child: Container(
                    padding: EdgeInsets.only(left: 10, right: 10),
                    child: Column(
                      crossAxisAlignment: CrossAxisAlignment.start,
                      children: [
                        Text('Name', style: TextStyle(fontSize: 18, fontWeight: FontWeight.bold),),
                        Text('Description'),
                        Text('0关注 0粉丝'),
                      ],
                    ),
                  ),
                ),

                CommonWidget.icon(),
              ],
            ),
          ),
        ),

        Expanded(
          flex: 1,
          child:SingleChildScrollView(
            child: Container(
              color: bgColor,
//              padding: EdgeInsets.only(bottom: 50, top: 30),
            //收藏、订阅、足迹   待付款、代发货、待收货、待评价、退款/售后
              child: Column(
                children: [
                  memberWidget(),
                  statusWidget(),
                  orderBanner(),
                  settingBuild(),
                ],
              ),
            ),
          ),
        ),
      ],
    );
  }

  Widget appbar() {
    return null;
  }

  /// 设置item
  Widget settingBuild(){
    return Obx(() => ListUtil.isEmpty(controller.mList.value)?emptyView():ListView.builder(
      shrinkWrap: true,
      physics: NeverScrollableScrollPhysics(),
      itemCount: controller.mList.value.length,
      itemBuilder: (BuildContext context, int index){
        String item = controller.mList.value[index];
        return GestureDetector(
          onTap: (){
            ToastUtil.toast("tap$index");
          },
          child: Container(
            color: Colors.white,
            padding: EdgeInsets.all(15),
            margin: EdgeInsets.only(bottom: 1),
            child: Flex(
              direction: Axis.horizontal,
              children: [
                Expanded(child: Text(item),flex: 1,),
                CommonWidget.icon(),
              ],
            ),
          ),
        );
      },
    ),
    );
  }

  /// 会员中心 四个按钮
  Widget memberWidget() {
    return Obx(() => ListUtil.isEmpty(controller.mMemberList.value) ? emptyView() : StaggeredGridView.countBuilder(
      physics: NeverScrollableScrollPhysics(),
      shrinkWrap: true,
      padding: EdgeInsets.only(top: 10, left: 8, right: 8),
      itemBuilder: (BuildContext context, int index){
        return itemFour(context, index);
      },
      crossAxisCount: 2,
      mainAxisSpacing: 15.0,
      crossAxisSpacing: 15.0,
      staggeredTileBuilder: (int index) => StaggeredTile.fit(1)/*new StaggeredTile.count(2, index.isEven ? 2 : 1)*/,
      itemCount: controller.mMemberList.value.length,
    ),
    );
  }

  /// 会员中心样式
  Widget itemFour(BuildContext context, int index) {
    IconTextBean item = controller.mMemberList.value[index];
    return GestureDetector(
      behavior: HitTestBehavior.opaque,
      onTap: (){
        ToastUtil.toast("tap$index");
      },
      child: Container(
        height: 50,
        color: Colors.red,
        padding: EdgeInsets.all(15),
        margin: EdgeInsets.only(bottom: 1),
        child: Flex(
          direction: Axis.vertical,
          children: [
            Expanded(child: Text(item.str),flex: 1,),
//            Icon(mMemberList[index].icon),
          ],
        ),
      ),
    );
  }

  /// 订单状态
  Widget statusWidget() {
    return Container(
      child: Obx(() => ListUtil.isEmpty(controller.mOrderList.value) ? emptyView() :
      Flex(
            direction: Axis.horizontal,
            children: List.generate(controller.mOrderList.value.length, (index){
              IconTextBean item = controller.mOrderList.value[index];
              return Expanded(
                flex: 1,
                child: GestureDetector(
                  behavior: HitTestBehavior.opaque,
                  onTap: (){
                    ToastUtil.toast("tap$index");
                  },
                  child: Container(
                    height: 100,
                    padding: EdgeInsets.all(15),
                    margin: EdgeInsets.only(bottom: 1),
                    child: Flex(
                      direction: Axis.vertical,
                      children: [
                        Expanded(child: Text(item.str),flex: 1,),
                        Icon(item.icon),
                      ],
                    ),
                  ),
                ),
              );
            }
            ),
          ),
          ),
    );
  }

  /*
  订单状态循环显示
   */
  Widget orderBanner() {
    return GestureDetector(
      behavior: HitTestBehavior.opaque,
      onTap: (){
        ToastUtil.toast("tap orderBanner");
      },
      child: Container(
        height: 60,
        margin: EdgeInsets.all(10),
        padding: EdgeInsets.all(5),
        decoration: BoxDecoration(
          color: Colors.white,
          borderRadius: BorderRadius.circular(10),
          boxShadow: [
            BoxShadow(
              color: Color(0xFFECECEC),  //底色,阴影颜色
              //offset: Offset(1, 1), //阴影位置,从什么位置开始
              blurRadius: 0.5,  // 阴影模糊层度
              spreadRadius: 2,  //阴影模糊大小
            ),
          ],
        ),
        child: Flex(
          direction: Axis.horizontal,
          children: [
            Image.asset('images/about_github.png', width: 50,height: 50,),
            Expanded(
              flex: 1,
              child: Padding(
                padding: EdgeInsets.only(left: 10, right: 10, top: 5),
                child: Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    Flex(
                      direction: Axis.horizontal,
                      children: [
                        Expanded(
                          child: Text('已发货:  已发货已发货已发货已发货已发货已发货',maxLines: 1,overflow: TextOverflow.ellipsis,),
                          flex: 1,
                        ),
                        Text('9:25',maxLines: 1,overflow: TextOverflow.ellipsis,),
                      ],
                    ),
                    Text('物流描述:   物流描述物流描述物流描述物流描述物流描述',maxLines: 1,overflow: TextOverflow.ellipsis,),
                  ],
                ),
              ),
            ),
          ],
        ),
      ),
    );
  }
}